<template>
	<view class="content">

		<view class="">
			<ren-dropdown-filter :filterData='filterData' :defaultIndex='defaultIndex' @onSelected='onSelected'
				@dateChange='dateChange'></ren-dropdown-filter>
		</view>
		<u-gap height="100"></u-gap>
		<view class="cu-list menu-avatar">
			<view class="u-icon--bottom"  v-if="maJiangData.length <= 0">
				<u-empty text="列表为空" icon-size="80" mode="list"></u-empty>
			</view>
			<view class="cu-item " v-for="i in maJiangData">
				<view class="cu-avatar radius lg" :style="'background-image:url('+i.avatar+');'"></view>
				<view class="content">
					<view class="text-grey">
						<view class="text-cut">{{i.loginName}}</view>
					</view>
					<view class="text-gray text-sm flex">
						<view class="text-cut">{{i.gameTime}}</view>
					</view>
				</view>
				<view class="action">
					<view class="text-grey text-xs">{{i.gameSize}} 局</view>
					<view class="cu-tag round sm" :class="i.gameScore>0?'bg-red':'bg-green'">{{i.gameScore}}</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import renDropdownFilter from '@/components/ren-dropdown-filter/ren-dropdown-filter.vue'
	import allGameUser from '@/api/tabbar/tabbar-4.api.js'
	export default {
		data() {
			return {
				maJiangData: [],
				params: {
					loginName: '',
					timeRange: '',
					selectDate: '',
					scoreStatus: 2
				},
				filterData: [
					[{
						text: '游戏玩家',
						value: ''
					}],
					[{
						text: '今天',
						value: 'today'
					}, {
						text: '昨天',
						value: 'yesterday'
					}, {
						text: '近三天',
						value: 'three'
					}, {
						text: '近七天',
						value: 'seven'
					}, {
						text: '近半个月',
						value: 'sub_month'
					}, {
						text: '近一个月',
						value: 'month'
					}, {
						text: '近三个月',
						value: 'three_month'
					}, {
						text: '近半年',
						value: 'sub_year'
					}, {
						text: '近一年',
						value: 'year'
					}]
				],
				defaultIndex: [0, 3]
			}
		},
		created() {
			this.allGameUser();
		},
		methods: {
			allGameUser(){
				this.$u.api.allGameUser().then((res) => {
					this.filterData[0] = res.rows;
					this.filterData[0].forEach((e,index)=>{
						if(e.value == this.vuex_user.gameUser){
							this.defaultIndex = [index, 3]
						}
					});
				})
			},
			onSelected(res) {
				this.params.loginName = res[0][0].value;
				this.params.timeRange = res[1][0].value;
				this.getData();
			},
			dateChange(d) {
				this.params.selectDate = d;
				this.getData();
			},
			getData() {
				this.$u.api.gameUserMjInfo(this.params).then((res) => {
					this.maJiangData = res.data.maJiangDayVos;
				})
			}
		},
		components: {
			renDropdownFilter
		}
	}
</script>

<style lang="scss">
	.u-icon--bottom {
		flex-direction: column;
		justify-content: center;
		margin-top: 50px;
	}
		
</style>
